import React, { Component, createRef } from 'react';
import { Form, Input, Button, Checkbox } from 'antd';
import './Login.less';
import { login } from '../../actions/index'
class Login extends Component {
    constructor(props) {
        super(props)
        this.state = {
            
        }
        this.form = createRef()
    }

    onFinish(value) {
        this.props.dispatch(login(value))
    };

    componentDidMount() {
        
    }

	render() {
		return (
			<div className="iu_login">
                <div className="bgc"></div>
                <div className="container">
                    <h1>请登录{this.props.state.username}</h1>
                    <Form
                        ref={this.form}
                        name="basic"
                        labelCol={{ span: 5, }}
                        wrapperCol={{span: 16,}}
                        onFinish={e => this.onFinish(e)}
                        autoComplete="off"
                    >
                    <Form.Item
                        label="用户名"
                        name="username"
                        rules={[{
                            required: true,
                            message: '请输入内容!',
                        },]}
                    >
                        <Input 
                            placeholder="请输入用户名"
                        />
                    </Form.Item>

                    <Form.Item
                        label="密码"
                        name="password"
                        rules={[
                        {
                            required: true,
                            message: '请输入内容!',
                        },
                        ]}
                    >
                        <Input.Password
                            placeholder="请输入用密码"
                         />
                    </Form.Item>

                    <Form.Item
                        name="remember"
                        valuePropName="checked"
                        wrapperCol={{ offset: 5, span: 16,}}
                    >
                        <Checkbox>记住密码</Checkbox>
                    </Form.Item>
                    <Form.Item
                        wrapperCol={{ offset: 5,span: 16,}}
                    >
                        <Button type="primary" htmlType="submit">提 交</Button>
                    </Form.Item>
                    </Form>
                </div>
			</div>
		)
	}
}
export default Login;
